<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>type属性演示</title>
</head>
<body>
    <!--
        type属性：
            <input type="text"/>        普通文本输入框
            <input type="password"/>    密码输入框
            <input type="email"/>       邮箱输入框
            <input type="radio"/>       单选框。必须有相同的name属性，value属性真实提交的数据，checked属性默认选中
            <input type="checkbox"/>    多选框。必须有相同的name属性，value属性真实提交的数据，checked属性默认选中

            <input type="date"/>            日期框
            <input type="time"/>            时间框
            <input type="datetime-local"/>  本地日期时间框
            <input type="number"/>          数字框
            <input type="range"/>           滚动条数值框 min-最小值  max-最大值  step-步进值
            <input type="search"/>          可清除文本框
            <input type="tel"/>             电话框
            <input type="url"/>             网址框
            <input type="file"/>            文件上传框
            <input type="hidden"/>          隐藏域  value属性设置实际提交的值


    -->

    <form action="#" method="get" autocomplete="off">
        <lable for="username">用户名：</lable>
        <input type="text" id="username" name="username"/> <br/>

        <lable for="password">密码：</lable>
        <input type="password" id="password" name="password"/> <br/>

        <lable for="email">邮箱：</lable>
        <input type="email" id="email" name="email"/> <br/>

        <lable for="gender">性别：</lable>
        <input type="radio" id="gender" name="gender" value="men" checked/> 男
        <input type="radio" name="gender" value="women"/>女
        <input type="radio" name="gender" value="other"/>其他 <br/>

        <lable for="hobby">爱好：</lable>
        <input type="checkbox" id="hobby" name="hobby" value="sing" checked/> 唱
        <input type="checkbox" name="hobby" value="jump"/>跳
        <input type="checkbox" name="hobby" value="rop"/>rop
        <input type="checkbox" name="hobby" value="basketball"/>篮球 <br/>





        <lable for="birthday">生日：</lable>
        <input type="date" id="birthday" name="birthday"/> <br/>

        <lable for="time">当前时间：</lable>
        <input type="time" id="time" name="time"/> <br/>

        <lable for="insert">注册时间：</lable>
        <input type="datetime-local" id="insert" name="insert"/> <br/>

        <lable for="age">年龄：</lable>
        <input type="number" id="age" name="age"/> <br/>

        <lable for="range">心情值(1~10)：</lable>
        <input type="range" id="range" name="range" min="1" max="10" step="1"/> <br/>

        <lable for="search">可全部清除文本：</lable>
        <input type="search" id="search" name="search"/> <br/>

        <lable for="tel">电话：</lable>
        <input type="tel" id="tel" name="tel"/> <br/>

        <lable for="url">个人网站：</lable>
        <input type="url" id="url" name="url"/> <br/>

        <lable for="file">文件上传：</lable>
        <input type="file" id="file" name="file"/> <br/>

        <lable for="hidden">隐藏信息：</lable>
        <input type="hidden" id="hidden" name="hidden" value="笨蛋"/> <br/>






        <button type="submit">提交</button>
        <button type="reset">重置</button>
    </form>
</body>
</html>